<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="backstage/common/head::head">
</head>
<body>


<style>
    #demo-nifty-settings {
        display: none !important;
    }
    #content-container:before {
        background: none;
    }
    .treebox {
        font-size: 16px;
        /*background:#f6f8fa;*/
        width: 18%;
        height: 100%;
        position: relative;
        /*margin: auto;*/
        float: left;
    }
    .wrap {
        /*text-align: center;*/
    }
    .ztree {
        /*padding-left: 200px;*/
        padding-top: 50px;
    }
    .ztree li span.button {
        background-position-x: -144px;
        background-position-y: -1px;
    }
    .lay-win {
        display: none;
    }
    #page-content{
        float: left;
        width: 78%;

        /*position: relative;*/
    }
    .boxed{
        height: 100%;
    }
    #content-container{
        height: 100%;
    }
    #input_search{
        width: 250px;
        height: 35px;
    }

</style>
<div id="container" class="effect aside-float aside-bright mainnav-lg">

    <!--NAVBAR-->
    <!--===================================================-->
    <header id="navbar" th:replace="backstage/common/header::header"></header>
    <!--===================================================-->
    <!--END NAVBAR-->

    <div class="boxed">
        <div id="content-container">
            <div class="treebox">
                <div class="wrap">
                    <ul id="treeDemo" class="ztree"></ul>
                </div>
            </div>
            <!--CONTENT CONTAINER-->
            <!--===================================================-->
            <div id="page-content">
                <input id="input_search" placeholder="输入关键字" />
                <button id="btn_search" class="btn btn-purple" onclick="searchByKeywords()"> 搜索
                </button>
                <button id="demo-btn-addrow" class="btn btn-purple" onclick="addArticle(1,null)"><i
                        class="demo-pli-add"></i> 增加
                </button>
                <table class="layui-table">
                    <thead>
                    <tr>
                        <th style="width:50px;">  序号 </th>
                        <th> 标题 </th>
                        <th> 类型 </th>
                        <th>  标签  </th>
                        <th style="width:250px;"> 操作 </th>
                    </tr>
                    </thead>
                    <tbody id="chai"></tbody>
                </table>

                <div id="page" style="align-content: center;text-align: center"></div>

            </div>
        </div>
        <!--===================================================-->
        <!--END CONTENT CONTAINER-->

        <!--MAIN NAVIGATION-->
        <!--===================================================-->
        <nav id="mainnav-container" th:replace="backstage/common/left::left(1)"></nav>
        <!--===================================================-->
        <!--END MAIN NAVIGATION-->

    </div>


    <!-- FOOTER -->
    <!--===================================================-->

    <footer id="footer" th:replace="backstage/common/foot::footer"></footer>
    <!--===================================================-->
    <!-- END FOOTER -->

    <!-- SCROLL PAGE BUTTON -->
    <!--===================================================-->
    <button class="scroll-top btn">
        <i class="pci-chevron chevron-up"></i>
    </button>
    <!--===================================================-->
</div>
<!--===================================================-->
<!-- END OF CONTAINER -->
<div class="lay-win">
    <form class="form-horizontal">
        <input type="hidden" name="type" id="article_type" />
        <input type="hidden" name="id" id="article_id" />
        <div class="panel-body">
            <div class="form-group">
                <label class="col-sm-3 control-label" for="input_title">文章标题</label>
                <div class="col-sm-6">
                    <input type="text" placeholder="请输入文章标题" class="form-control input-sm" id="input_title" name="title">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="select_type">文章类型</label>
                <div class="col-sm-3">
                    <!--<input type="text" placeholder="请输入文章类型" class="form-control">-->
                    <select type="text" placeholder="请输入文章类型" class="form-control" id="select_type" name="underType"></select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="appName">app名称</label>
                <div class="col-sm-3">
                    <!--<input type="text" placeholder="请输入文章类型" class="form-control">-->
                    <input type="text" placeholder="请输入app名称" class="form-control" id="appName" name="appName"></input>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label" for="select_type">是否轮播图</label>
                <div class="col-sm-3">
                    <!--<input type="text" placeholder="请输入文章类型" class="form-control">-->
                    <select type="text" placeholder="请选择" class="form-control" id="is_rotation" name="isRotation">
                        <option value="0">
                            不是
                        </option>
                        <option value="1">
                            是
                        </option>
                    </select>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label" for="select_type">是否序列号文章</label>
                <div class="col-sm-3">
                    <!--<input type="text" placeholder="请输入文章类型" class="form-control">-->
                    <select type="text" placeholder="请选择" class="form-control" id="category" name="category">
                        <option value="1">
                            普通文章
                        </option>
                        <option value="2">
                            序列号文章
                        </option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="select_lable">文章标签</label>
                <div class="col-sm-3">
                    <input type="text" placeholder="请输入文章标签（多个标签用‘，’分割）" class="form-control" name="labelVals" id="select_lable" >
                    <!--<select type="text" placeholder="请输入文章标签（多个标签用‘，’分割）" class="form-control" id="select_lable" name="labels"></select>-->
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="select_lable">app图片</label>
                <div class="col-sm-3">
                    <!--<input type="" placeholder="请选择图片" class="form-control" name="appImg" id="appImg" >-->
                    <img src="" id="tu" alt="" class="backimg" width="100px" height="100px">
                    <input type="hidden" name="appImg" id="appImg">
                    <button type="button" class="layui-btn" id="shangchuan">
                        <i class="layui-icon">&#xe67c;</i>上传图片
                    </button>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="metaTitle">网页标题</label>
                <div class="col-sm-3">
                    <!--<input type="text" placeholder="请输入文章类型" class="form-control">-->
                    <input type="text" placeholder="请输入文章描述" class="form-control" id="metaTitle" name="metaTitle"/>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="metaKeywords">文章网页关键字</label>
                <div class="col-sm-3">
                    <!--<input type="text" placeholder="请输入文章类型" class="form-control">-->
                    <input type="text" placeholder="请输入文章关键字" class="form-control" id="metaKeywords" name="metaKeywords"/>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="metaTitle">网页描述</label>
                <div class="col-sm-3">
                    <!--<input type="text" placeholder="请输入文章类型" class="form-control">-->
                    <input type="text" placeholder="请输入文章描述" class="form-control" id="metaDescribtion" name="metaDescribtion"/>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="select_visible_type">可见类型</label>
                <div class="col-sm-3">
                    <select id="select_visible_type" name="visibleType">
                       <!-- <option>请选择</option>
                        <option value="">
                            可见
                        </option>
                        <option>
                            登陆可见
                        </option>
                        <option>
                            购买可见
                        </option>-->
                    </select>
                </div>
            </div>
            <!--<div class="form-group">
                <label class="col-sm-3 control-label" >下载</label>
                <div class="col-sm-3" >
                    &lt;!&ndash;<select placeholder="请选择下载方式" class="form-control" id="select_down" name="down_type"></select>&ndash;&gt;
                    <input type="text" placeholder="请输入下载方式" class="form-control" value="云盘下载" readonly>
                    <input type="hidden" name="down_type" value="14"/>
                </div>
                <div class="col-sm-3">
                    <input type="text" placeholder="请输入下载地址" class="form-control" name="down_url" >
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" ></label>
                <div class="col-sm-3" >
                    &lt;!&ndash;<select placeholder="请选择下载方式" class="form-control" id="select_down" name="down_type"></select>&ndash;&gt;
                    <input type="text" placeholder="请输入下载方式" class="form-control" value="高速下载" readonly>
                    <input type="hidden" name="down_type" value="15"/>
                </div>
                <div class="col-sm-3">
                    <input type="text" placeholder="请输入下载地址" class="form-control" name="down_url" >
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" ></label>
                <div class="col-sm-3" >
                    &lt;!&ndash;<select placeholder="请选择下载方式" class="form-control" id="select_down" name="down_type"></select>&ndash;&gt;
                    <input type="text" placeholder="请输入下载方式" class="form-control" value="荔枝正版" readonly>
                    <input type="hidden" name="down_type" value="16"/>
                </div>
                <div class="col-sm-3">
                    <input type="text" placeholder="请输入下载地址" class="form-control" name="down_url" >
                </div>
            </div>-->
            <div class="form-group">
                <label class="col-sm-3 control-label" for="LAY_content">文章内容</label>
                <div class="col-sm-6">
                    <div style="margin-bottom: 20px;">
                        <textarea class="layui-textarea" id="LAY_content" style="display: none" name="content"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>



</body>

<div id="page" style="text-align: center;"></div>
<script th:inline="javascript">
    function page(totalCount,currPage,id) {
        // console.log("4",totalCount)
        layui.use(['laypage'], function () {
            var laypage = layui.laypage;
            //执行一个laypage实例
            laypage.render({
                elem: 'page' //注意，这里的 test1 是 ID，不用加 # 号
                , count: totalCount //数据总数，从服务端得到
                , curr: currPage
                , limit: 20
                , jump: function (obj, first) {
                    //首次不执行
                    if (!first) {
                        // console.log(obj)
                        articlePageData(id, obj.curr, 20);
                    }
                }
            });
        });
    }
</script>
<script>
    $(function () {
        layui.use('upload', function(){
            var upload = layui.upload;

            //执行实例
            var uploadInst = upload.render({
                elem: '#shangchuan' //绑定元素
                ,url: '/backstage/article/uploadImage' //上传接口
                ,done: function(res){
                    //上传完毕回调
                    // console.log(res.data.src);
                    $("#appImg").val(res.data.src);
                    $("#tu").attr("src",res.data.src);
                }
                ,error: function(){
                    //请求异常回调
                }
            });
        });

        //文章可见类型
        findlables(4,'#select_visible_type');
        findtypes();
        renderForm();
    });


    /*layui.use('layedit', function () {
        var layedit = layui.layedit
            , $ = layui.jquery;

        //构建一个默认的编辑器
        var index = layedit.build('LAY_content');

        //编辑器外部操作
        var active = {
            content: function () {
                alert(layedit.getContent(index)); //获取编辑器内容
            }
            , text: function () {
                alert(layedit.getText(index)); //获取编辑器纯文本内容
            }
            , selection: function () {
                alert(layedit.getSelection(index));
            }
        };

        $('.site-demo-layedit').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });*/

    function addArticle(type,id) {
        resetForm();
        if (type == 0) {
            findArticleById(id);
        }else {
            layui.use(['layer','layedit'], function () {
                var layedit = layui.layedit;
                var layer=layui.layer;
                layedit.set({
                    uploadImage: {
                        url: '/backstage/article/uploadImage',
                        type: 'post'
                    }
                });
                var index ;
                layer.open({
                    type: 1,
                    area: ['1200px','80vh'],
                    content: $('.lay-win'),
                    btn: ['保存', '取消'],
                    scrollbar:true,
                    success:function(){
                         index = layedit.build('LAY_content', {
                            tool: ['face', 'link', 'unlink', '|', 'left', 'center', 'right', '|','image']
                            ,height: 100
                        });
                    },
                    yes: function (){
                        var content=layedit.getContent(index); //获取编辑器内容
                        saveArticle(content)
                    }
                })
            })
        }

    }

var typeId;
    //添加文章
    function saveArticle(content) {
        var url = '/backstage/article/saveArticle';
        var d = {};
        var vals = $(".form-horizontal").serializeArray();
        $.each(vals, function () {
            d[this.name] = this.value;
        });
        d.labelVals=d.labelVals.split('，');
        /*downs=[];
        var down1={"url":$("[name='down_url']").eq(0).val(),"type":$("[name='down_type']").eq(0).val()};
        var down2={"url":$("[name='down_url']").eq(1).val(),"type":$("[name='down_type']").eq(1).val()};
        var down3={"url":$("[name='down_url']").eq(2).val(),"type":$("[name='down_type']").eq(2).val()};
        downs.push(down1);
        downs.push(down2);
        downs.push(down3);
        d.downloadUrl=downs;*/
        d.content=content;
        //console.log(d)
        var data=JSON.stringify(d);
        $.ajax({
            url: url,
            type: 'post',
            data: data,
            contentType: 'application/json',
            success: function (res) {
                layer.alert(res);
                resetForm();
                // location.href = "/backstage/article";
                // var type=$("#select_type").val();
                articlePage(typeId,1,20);
                layer.closeAll('page'); //关闭所有页面层
               // layer.close("");
            }
        });
    }

    //修改文章
    function updateArticle(content) {
        var url = '/backstage/article/updateArticle';
        var d = {};
        var vals = $(".form-horizontal").serializeArray();
        $.each(vals, function () {
            d[this.name] = this.value;
        });
        d.labelVals=d.labelVals.split('，');
        // downs=[];
        // var down={"url":$("[name='down_url']").eq(0).val(),"type":$("[name='down_type']").eq(0).val()};
        // downs.push(down);
        // d.downloadUrl=downs;
        d.content=content;
        var data=JSON.stringify(d);
        $.ajax({
            url: url,
            type: 'post',
            data: data,
            contentType: 'application/json',
            success: function (res) {
                layer.alert(res);
                resetForm();
                // location.href = "/backstage/article";
                articlePage(typeId,1,20);
                layer.closeAll('page'); //关闭所有页面层
            }
        });
    }

    /**
     * 删除文章
     * @param dictId 字典id
     */
    function delArticle(aid) {
        $.ajax({
            url: '/backstage/article/delArticleById',
            type: 'post',
            data: {"id": aid},
            // contentType: 'application/json',
            success: function (res) {
                // location.href = "/backstage/article";
                resetForm();
                // console.log("typeId",typeId)
                articlePage(typeId,1,20);
            }
        });
    }

    function findArticleById(aid) {
        $.ajax({
            url: '/backstage/article/findArticleById',
            type: 'post',
            data: {"id": aid},
            // contentType: 'application/json',
            success: function (res) {
                $('#article_id').val(res.id);
                $('#article_type').val(res.type);
                $('#category').val(res.category);
                $('#input_title').val(res.title);
                $('#select_type').val(res.underType);
                $('#select_lable').val(res.labelVals);
                $('#metaTitle').val(res.metaTitle);
                $('#metaKeywords').val(res.metaKeywords);
                $('#metaDescribtion').val(res.metaDescribtion);
                $('#select_visible_type').val(res.visibleType);
                $('#appName').val(res.appName);
                $('.backimg').attr('src',url+res.appImg);
                $('#is_rotation').val(res.isRotation);

                /*var downHtml='';
                $.each(res.downloadUrl,function (i,d) {
                    $('[name="down_url"]').eq(i).val(d.url);
                });*/
                $("#LAY_content").text(res.content);
                layui.use(['layer','layedit'], function () {
                    var layedit = layui.layedit
                        , $ = layui.jquery;
                    layedit.set({
                        uploadImage: {
                            url: '/backstage/article/uploadImage',
                            type: 'post'
                        }
                    });
                    var index ;
                   layui.layer.open({
                        type: 1,
                        area: ['1200px','80vh'],
                        content: $('.lay-win'),
                        btn: ['保存', '取消'],
                        scrollbar:true,
                       success:function(){
                            index= layedit.build('LAY_content');
                       },
                        yes: function (){
                            var content=layedit.getContent(index); //获取编辑器内容
                            // console.log(content);
                            updateArticle(content);
                        }
                    })
                })
               /* layui.use('layedit', function(){
                    var layedit = layui.layedit;
                    var index=layedit.build('LAY_content'); //建立编辑器
                    layedit.sync(index)
                });*/

            }
        });
    }

    //查找文章类型
    function findtypes() {
        $.ajax({
            url: '/backstage/nav/articleTypeList',
            type: 'post',
            // contentType: 'application/json',
            success: function (res) {
                var type_select='';
                $.each(res,function(i,n){
                    type_select+=`<option value="${n.id}"> ${n.name} </option>`;
                });
                $('#select_type').html(type_select);
            }
        });
    }
    //查找文章可见类型
    /*function findVisibleType() {
        $.ajax({
            url: '/download/item/itemList',
            type: 'post',
            data: {"dictionaryId": 4},
            // contentType: 'application/json',
            success: function (res) {
                var type_select='';
                $.each(res,function(i,n){
                    type_select+=`<option value="${n.id}"> ${n.value} </option>`;
                });
                $('#select_visible_type').html(type_select);
            }
        });
    }*/


    function resetForm(){
        $('#type').val("");
        $('#article_id').val("");
        $('#article_type').val("");
        $('#category').val("");
        $('#input_title').val("");
        $('#select_type').val("");
        $('#select_lable').val("");
        $('#metaTitle').val("");
        $('#metaKeywords').val("");
        $('#select_visible_type').val("");
        $('#appName').val("");
        $('#metaDescribtion').val("");
        $('#LAY_content').text("");
        $("#tu").attr("src","");
        // $("[name='down_url']").val("");
    }



    function previewImg(){

        var img=$("#appImg").eq(0);
        $.ajax({
            url : '/backstage/article/uploadImage',
            type: "POST",
            data : {
                "file":img,//压缩后的base值
            },
            cache:false,
            async:false,
            contentType : false,
            processData : false,

            success : function(data) {
                alert("成功");
                $('.backimg').attr('src',JSON.parse(info).msg)
            },
            error : function(){

            }
        });
    }

    function historical(id){
        location.href="/backstage/article/historicalVersion?artId="+id;
    }


    function searchByKeywords(){

        articlePage(typeId,1,20);
    }


</script>

<!--Specify page [ SAMPLE ]-->
<script src="../../static/backstage/js/demo/dashboard.js"></script>
<script src="../../static/backstage/js/jquery.ztree.all.js"></script>
<script>
    var setting = {
        view: {
            addHoverDom: addHoverDom,
            removeHoverDom: removeHoverDom,
            selectedMulti: false
        },
        edit: {
            enable: true,
            editNameSelectAll: true,
            showRemoveBtn: true,
            showRenameBtn: true,
            removeTitle: '删除',
            renameTitle: '重命名'
        },
        data: {
            simpleData: {
                enable: true,
                pIdKey: "parentId",
                idKey: 'zid'
            },
            key: {
                children: "children"
            }
        },
        callback: {
            beforeDrag: beforeDrag,
            beforeEditName: beforeEditName,
            beforeRemove: beforeRemove,
            onRemove: onRemove,
            onRename: onRename,
            onClick: zTreeOnClick
        }
    };
    var zNodes = [{id: 0, parentId: 0, name: "分类管理", pids: "--0--", open: true}];
    $.ajax({
        url: '/backstage/nav/navBarListByParent',
        type: 'get',
        success: function (res) {
            zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
            var zTree = $.fn.zTree.getZTreeObj("treeDemo");
            zTree.addNodes(zNodes, res);
           /* zNodes = zNodes.concat(res);
            zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, zNodes);*/
        }
    })
    zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
    var log, className = "dark";

    function beforeDrag(treeId, treeNodes) {
        return false;
    }

    function beforeEditName(treeId, treeNode) {
        className = (className === "dark" ? "" : "dark");
        showLog("[ " + getTime() + " beforeEditName ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
        var zTree = $.fn.zTree.getZTreeObj("treeDemo");
        zTree.selectNode(treeNode);

    }

    function beforeRemove(treeId, treeNode) {

        className = (className === "dark" ? "" : "dark");
        showLog("[ " + getTime() + " beforeRemove ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
        var zTree = $.fn.zTree.getZTreeObj("treeDemo");
        zTree.selectNode(treeNode);
        if (confirm("确认删除'" + treeNode.name + "' ?")) {
            delNav(treeNode.id);
        } else {
            return false;
        }
    }

    function onRemove(e, treeId, treeNode) {

        showLog("[ " + getTime() + " onRemove ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
    }

    function beforeRename(treeId, treeNode, newName, isCancel) {
        return true;
    }

    function onRename(e, treeId, treeNode, isCancel) {
        showLog((isCancel ? "<span style='color:red'>" : "") + "[ " + getTime() + " onRename ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name + (isCancel ? "</span>" : ""));
        let zid = treeNode.zid
        let bol = true
        if (treeNode.zid) {
            bol = false

        } else {
            zid = 'SF0' + new Date().getTime()
        }
        updateNav (treeNode);

    }

    function showRemoveBtn(treeId, treeNode) {
        return !treeNode.isFirstNode;
    }

    function showRenameBtn(treeId, treeNode) {
        return !treeNode.isLastNode;
    }

    function showLog(str) {
        if (!log) log = $("#log");
        log.append("<li class='" + className + "'>" + str + "</li>");
        if (log.children("li").length > 8) {
            log.get(0).removeChild(log.children("li")[0]);
        }
    }

    function getTime() {
        var now = new Date(),
            h = now.getHours(),
            m = now.getMinutes(),
            s = now.getSeconds(),
            ms = now.getMilliseconds();
        return (h + ":" + m + ":" + s + " " + ms);
    }

    var newCount = 1;

    function addHoverDom(treeId, treeNode) {

        var sObj = $("#" + treeNode.tId + "_span");
        if (treeNode.editNameFlag || $("#addBtn_" + treeNode.tId).length > 0) return;
        var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
            + "' title='add node' onfocus='this.blur();'></span>";
        sObj.after(addStr);
        var btn = $("#addBtn_" + treeNode.tId);
        if (btn) btn.bind("click", function () {
            addNav(treeNode);
            return false;
        });
    };

    function removeHoverDom(treeId, treeNode) {
        $("#addBtn_" + treeNode.tId).unbind().remove();

    };

    function selectAll() {
        var zTree = $.fn.zTree.getZTreeObj("treeDemo");
        zTree.setting.edit.editNameSelectAll = $("#selectAll").attr("checked");
    }

    var pageData;
    var totalSize;
    function articlePageData(typeId,pageIndex,pageSize){
        var keywords=$("#input_search").val();
        $.ajax({
            url: '/backstage/article/selectArticlesByType',
            type: 'get',
            data: {"keywords":keywords,"type": typeId, "pageIndex": pageIndex, "pageSize":pageSize},
            async: false,
            success: function (res) {
                pageData=res;
                var data = "";
                if (res != null) {
                    $.each(res.list, function (i, n) {
                        data += `<tr>
                                                    <td>${i+1}</td>
                                                    <td>${n.title}</td>
                                                    <td>${n.typeName}</td>
                                                    <td>${n.tags}</td>
                                                    <td>
                                                        <button id="demo-btn-addrow" class="btn btn-info" onclick="historical(${n.id})"> 下载管理</button>
                                                        <button id="demo-btn-addrow" class="btn btn-info" onclick="addArticle(0,${n.id})"> 修改</button>
                                                        <button id="demo-btn-addrow" class="btn btn-danger" onclick="delArticle(${n.id})"> 删除</button>
                                                    </td>
                                                </tr>`;
                    });
                    $("#chai").html(data);
                    totalSize=res.totalSize;
                    // console.log("1",totalSize)
                }
            }
        });
    }
    function articlePage(typeId,pageIndex,pageSize) {
        // console.log("2",totalSize)
//查找节点下的文章
        articlePageData(typeId,pageIndex,pageSize);
        // console.log("3",totalSize)
        page(totalSize,pageIndex,typeId);
    }

    //点击tree节点
    function zTreeOnClick(event, treeId, treeNode) {
        $("#article_type").val(treeNode.parentId);
        $("#select_type").val(treeNode.id);
        typeId=treeNode.id;
        //c查找子节点
        $.ajax({
            url: '/backstage/nav/navBarListByParent',
            type: 'get',
            data:{"parentId":treeNode.id},
            success: function (res) {
                removeNodes();
                if(res.length>0){
                    var zTree = $.fn.zTree.getZTreeObj("treeDemo");
                    $.each(res,function(i,n){
                        zTree.addNodes(treeNode, {id: n.id, parentId: treeNode.id, name: n.name});
                    });
                }
            }
        });
        articlePage(treeNode.id,1,20);//分页
    };
    function removeNodes()
    {
        var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
        //选中节点
        var nodes = treeObj.getSelectedNodes();
        for (var i=0, l=nodes.length; i < l; i++)
        {
            //删除选中的子节点
            treeObj.removeChildNodes(nodes[i]);
        }
    }

    //新增类型
    function addNav (treeNode){
        var node={parentId: treeNode.id, name: "new node" + (newCount++)};
        var data={"name":node.name,"parentId":node.parentId};
        var url='/backstage/nav/addNav';
        $.ajax({
            url: url,
            type: 'post',
            data: JSON.stringify(data),
            contentType: 'application/json',
            success: function (res) {
                var zTree = $.fn.zTree.getZTreeObj("treeDemo");
                // var node={id: res, parentId: treeNode.id, name: "new node" + (newCount++)};
                node.id=res;
                zTree.addNodes(treeNode, node);
            }
        });
    }
    //删除类型
    function delNav (id){
        var data={"id":id};
        var url='/backstage/nav/delNavById';
        $.ajax({
            url: url,
            type: 'post',
            data: data,
            // contentType: 'application/json',
            success: function (res) {

            }
        });
    }
    //修改类型
    function updateNav (treeNode){
        var data={"id":treeNode.id,"name":treeNode.name};
        var url='/backstage/nav/updateNavName';
        $.ajax({
            url: url,
            type: 'post',
            data: JSON.stringify(data),
            contentType: 'application/json',
            success: function (res) {
                var zTree = $.fn.zTree.getZTreeObj("treeDemo");
                treeNode.zid = zid
                zTree.updateNode(treeNode);
            }
        });
    }




</script>


</html>